<template>
  <div class="footer">
      <div class="price-desc">
        <span class="iconfont">&#xe60d;</span><span class="price-desc-highlight">票面价</span>是指通过景区指定窗口售卖的纸质门票上标注的价格
      </div>
      <div class="footer-wrapper">
          <span class="iconfont footer-icon">&#xe689;<em class="footer-desc">机票</em></span> 
          <span class="iconfont footer-icon">&#xe60e;<em class="footer-desc">酒店</em></span> 
          <span class="iconfont footer-icon">&#xe8e9;<em class="footer-desc">公寓</em></span>
      </div>
      <div class="footer-nav">
          <a href="http://user.qunar.com/mobile/login.jsp?ret=http%3A%2F%2Fpiao.qunar.com%2Ftouch%2Findex_%25E5%258C%2597%25E4%25BA%25AC.html">登录</a>
          <a href="http://touch.qunar.com/h5/user/usercenter">我的订单</a>
          <a href="http://touch.qunar.com/h5/recent">最近浏览</a>
          <a href="http://touch.qunar.com/h5/about">关于我们</a>     
      </div>
      <div class="mobile-pc border-top">
          <ul>
              <li>
                  <a href="" class="active">触屏版</a>
                  <a href="" class="footer-pc">电脑版</a>
              </li>
          </ul>
      </div>
      <div class="footer-copyright">
          <span>
              Qunar 京ICP备05021087
          </span>
          <a href="http://touch.qunar.com/h5/feedback" class="feedback">意见反馈</a>
      </div>
  </div>
</template>

<script>
export default {
    name: 'HomeFooter'
}
</script>

<style lang="stylus" scoped>
    .footer
        background #f3f3f3
        .price-desc
            height .32rem
            margin-top .1rem
            padding .14rem .1rem
            font-size .24rem
            line-height .32rem
            background #fff
            color #616161
            .iconfont
                font-size .25rem
            .price-desc-highlight
                font-weight: bold
                margin-left .1rem
        .mobile-pc
            border-top .03rem solid #dbdbdb
            background #F3F3F3
            padding: .1rem 0 0 0
            font-size .32rem
            height .6rem
            line-height .6rem
            text-align: center
            .active
                color #000
        .footer-wrapper
            font-size .24rem
            height .8rem
            line-height .8rem
            text-align center
            .footer-icon
                padding .1rem
                .footer-desc
                    padding .1rem
                    font-size .26rem
                    color gray
        .footer-nav
            height .64rem
            line-height .64rem
            text-align center
            font-size .32rem          
        .footer-copyright 
            font-size .28rem
            padding .2rem
            text-align center
            color #9e9e9e
            .feedback
                color #9e9e9e
</style>